<template>
	<div id="ewm">
		<header class="mui-bar mui-bar-nav">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">二维码</h1>
		</header>
		<div class="mui-content">
			<div class="logo">
				<img src="../assets/images/erwm/qrcode_logo.png" alt="小芒钱包" />
			</div>
		    <div class="erwm">
				<img src="../assets/images/erwm/erwm.png" alt="小芒钱包" />
			</div>
		    <div>
		    	<img src="../assets/images/erwm/step1.png" alt="小芒钱包"  class="step1"/>
		    	<img src="../assets/images/erwm/step2.png" alt="小芒钱包"  class="step1"/>
		    </div>
		    <div class="save" @click='save("http://res.hschefu.com/img/car/e485c02945c046869250179fa1dc93f9/bbdb7aead52b4fcdaa8ec69ea68f2357.png")'>
		    	保存二维码到相册
		    </div>
		    <a class="save" href="http://res.hschefu.com/img/car/e485c02945c046869250179fa1dc93f9/bbdb7aead52b4fcdaa8ec69ea68f2357.png" download="二维码">保存二维码到相册</a>
		</div>
	</div>

</template>

<script>
	export default{
		methods:{
			save(url){
				window.open(url);
			}
		}
	}
</script>

<style lang="scss">
	@import "../assets/css/funcs.scss";
	@import '../assets/css/common.scss';
	@import '../assets/css/styles.scss';
	#ewm{
		.mui-content{
			background-color: #fff;
			padding-bottom:100px;
			.logo{
				width: 140px;
				margin: auto;
				margin-top: 61px;
				img{
					width:100%;
				}
			}
			.erwm{
				width: 148px;
				height: 148px;
				margin: auto;
				margin-top: 42.5px;
				img{
					width: 100%;
				}
			}
			.save{
				width: 92%;
				margin: auto;
				height: pxToRem(86px);
				line-height: pxToRem(86px);
				text-align: center;
				color: #fff;
				font-size: pxToRem(32px);
				border-radius: 4px;
				padding: 0;
				border: none;
				background: linear-gradient(72deg, rgba(248, 128, 0, 1), rgba(255, 154, 10, 1));
				margin: auto;
				margin-top: 30px;
			}
		}
		
	}
	

</style>